<template>
	<div class="root">
		<router-link :to="'/home/shop/'+shop.id">
			<img :src="shop.image_path|imgFil"/>
			<div>
				<h2>{{shop.name}}</h2>
				<Rater 
					v-model="shop.rating"
					:font-size="starSize"
					disabled
				></Rater>
			</div>
		</router-link>
	</div>
</template>

<script>
	import {imgFil} from "../util/filters.js";
	
	import {Rater} from "vux";
	
	
	export default {
		filters:{
			imgFil
		},
		props:["shop","starSize"],
		components:{
			Rater
		},
		
	}
</script>

<style scoped>
	.root{
		
		padding: 10px;
		border-bottom: solid 1px #999999;
	}
	
	.root a{
		display: flex;
	}
	
	h2{
		margin: 0;
		font-size: 1.4rem;
	}
	
	.root img{
		width: 8rem;
		height: 8rem;
	}
	
</style>